<template>
  <div>
    <img
      class="slogon w-full"
      :src="require('@/assets/page4/slogon.png')"
      alt=""
    />
    <img
      class="text1 center"
      :src="require('@/assets/page4/text1.png')"
      alt=""
    />
    <img
      class="text2 center"
      :src="require('@/assets/page4/text2.png')"
      alt=""
    />
    <img
      class="center btn"
      :src="require('@/assets/page4/btn.png')"
      alt=""
      @click="gotoPage"
    />
    <InsiBtn />
  </div>
</template>

<script>
import InsiBtn from './InsiBtn';
export default {
  components: {
    InsiBtn,
  },
  name: '',
  data() {
    return {};
  },
  methods: {
    gotoPage() {
      this.$router.push('/Page5');
    },
  },
};
</script>

<style lang='scss' scoped>
@import '../styles/function.scss';
.slogon {
  margin-bottom: switchwidth(140);
}
.text1 {
  width: switchwidth(910);
  margin-bottom: switchwidth(129);
}
.text2 {
  width: switchwidth(1016);
  margin-bottom: switchwidth(129);
}
.btn {
  width: switchwidth(515);
  margin-bottom: switchwidth(73);
}
</style>
